<template>
  <div class="home">
      <div class="top">
          <div class="info">
            <h2>Good Morning, <span>buddy</span></h2>
            
            <div class="addBtn"> 
              <span>平台管理</span>
              <div class="btn" @click="goPage()">+添加平台</div>
            </div>
          </div>
          <img src="~@/assets/img/neiwangsaas/item1.png" alt="">
      </div>

      <div class="searchParams">
         <span>企业列表</span>
         <!-- <el-input style="width:347px;" v-model="state.searchParams.keyWord" placeholder="请输入平台名称关键词"></el-input> -->
         <el-input style="width:347px;" v-model="state.searchParams.keyWord" placeholder="请输入平台名称关键词"></el-input>
      </div>

      <div class="arr">
           <el-table :data="state.tableArr"  align="center" :header-cell-style="{background: '#fff',color: '#7A8499',}"  >
                                    <el-table-column prop="" label="企业logo"  width="">
                                        <template #default="scope">
                                            <img style="width: 48px;height: 48px;" :src="scope.row.imgs" >
                                        </template>
                                    </el-table-column>
                                    <el-table-column prop="ctime" sortable label="公司名称"  width="">
                                    </el-table-column>
                                    
                                    <el-table-column prop="keyword" label="有效期"  width="">
                                    </el-table-column>
                                    <el-table-column prop="writer" label="是否停用"   width="">
                                         <template #default="scope">
                                            <div style="display: flex;justify-content: center;align-items:center;" >
                                              <img style="width: 2.25rem;height:2.25rem;border-radius:50%;" :src="scope.row.avatar" >
                                              <span style="margin-left:0.5rem;">{{scope.row.writer}}</span>
                                            </div>
                                        </template>
                                    </el-table-column>
                                    
                                      <el-table-column prop="" label='选择置顶'  width="">
                                      <template #default="scope">
                                          <div style="display: flex;justify-content: center;" v-if="scope.row.status==0">
                                            <div style="min-width:40px; width: 4.375rem;height: 24px;background: linear-gradient(41deg, #FF6D14, #FFAD81);;border-radius: 2px;cursor: pointer;color:#fff;" @click="assessorRow(scope.row,3)">
                                              置顶
                                            </div>
                                          </div>
                                        </template>
                                      </el-table-column>
                                      <el-table-column prop="" label='操作'  width="">
                                      <template #default="scope">
                                        <div style="display: flex;justify-content: center;" v-if="scope.row.status==0">
                                          <div style="min-width:40px; width: 4.375rem;height: 24px;background: linear-gradient(41deg, #FF6D14, #FFAD81);;border-radius: 2px;cursor: pointer;color:#fff;" @click="assessorRow(scope.row,3)">
                                            编辑
                                          </div>
                                        </div>
                                      </template>

                                    </el-table-column>
            </el-table>
      </div>

  </div>
</template>
<script>
import { getCurrentInstance, onMounted, reactive,inject } from 'vue'
import { useRouter } from 'vue-router'
import { createLogger, useStore } from 'vuex'
const state = reactive({
    searchParams:{
      keyWord:'',
    },
    tableArr:[],
  });
export default {
  name: 'platformManList',
  components: {},
  setup(props,{emit}) {
      const ctx = getCurrentInstance();
      const _this = ctx.appContext.config.globalProperties
      const router = useRouter();
      const store = useStore();
      function goPage(){
        console.log('111');
        // router.push('/platformMan/addPlatformMan-add')
        console.log(router);
        router.push({
          name:'addPlatformMan'
        })
      }
     
      onMounted(()=>{
      console.log('执行了')

      });
      return{
        state,router,goPage
      }
  },
  onMounted(){
  },
  data () {
    return {
    }
  },
  props: {},
  watch: {},
  methods: {},
  computed: {},
  mounted () {
  }
}
</script>
<style lang="scss" scoped>
.home{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 100%;
}
.top {
  // width: 99.6875rem;
  width: 85%;
  height: 13rem;
  background: #FFFFFF;
  box-shadow: 0px 0px 20px 0px rgba(98, 145, 238, 0.1);
  border-radius: 20px;
  display: flex;
  justify-content: space-between;
  margin-top: 2.375rem;
  padding: 0 3.9375rem;
  align-items: center;
  .info {
    h2 {
      font-size: 2.125rem;
      span {
        color: #FA8876;
        margin-right: 3.5625rem;

      }
    }

   
    .addBtn {
      display: flex;
      align-items: center;
      font-size: 1.25rem;
      span{
        color: #7A8499;
      }
      .btn{
        margin-left: 2.0625rem;
        display: grid;
        place-items: center;
        width: 108px;
        height: 40px;
        background: #6C91ED;
        color: #fff;
        box-shadow: 0px 2px 6px 0px rgba(110, 132, 179, 0.2);
        border-radius: 8px;
        cursor: pointer;
      }
    }
  }

  img {
    width: 27.4375rem;
    height: 15.10625rem;
    transform: translateY(-1.0625rem);
  }
}

.searchParams {
  width: 85%;
  // height: 2.5rem;
  padding: 1.25rem;
  font-size: 20px;
  span {
    color: #7A8499;
    margin-right: 3.5625rem;
  }
}

.arr {
  background: #fff;
   width: 85%;
  height: 637px;
  background: #FFFFFF;
  box-shadow: 0px 0px 20px 0px rgba(98, 145, 238, 0.1);
  border-radius: 20px;
}

/deep/ .el-table th > .cell{
  display: flex;
  justify-content: center;
}


</style>
